<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:tiles="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorator="common/layout">
<head>
    <title>新建用户</title>
</head>
<body>
<section layout:fragment="top_menu" style="text-align: left;padding-left: 20px">
    <!--<span style="font-size: 20px">添加员工</span>-->
</section>

<section layout:fragment="extra_scripts">
    <script th:inline="javascript">
        $(function(){

            setTimeout(function(){
                $("#userForm").ajaxForm({
                            callback: function(data) {
                                if (data.valid) {
                                    self.location.href = data.url || '/';
                                } else {
                                    alert(data.errorMsg);
                                }
                            },
                            validate: function(data) {
                                var employee_no = $("#employee_no").val();
                                if(employee_no.length==0){
                                    alert("工号不能为空");
                                    return false;
                                }
                                if(employee_no.length>10){
                                    alert("工号最大长度为10");
                                    return false;
                                }

                                var user_name = $("#user_name").val();
                                if(user_name.length==0){
                                    alert("姓名不能为空");
                                    return false;
                                }
                                if(user_name.length>10){
                                    alert("姓名最大长度为10");
                                    return false;
                                }

                                var password_id = $("#password_id").val();
                                if(password_id.length==0){
                                    alert("密码不能为空");
                                    return false;
                                }
                                var reg = /^\d+(\.\d+)?$/;
                                var phoneNum = $.trim($("#mobile_id").val());
                                if(phoneNum.length>0) {
                                    if (!isValidPhone(phoneNum)) {
                                        alert("无效的手机号码！" + phoneNum);
                                        $("#mobile_id").val("");
                                        return false;
                                    }
                                }
                                return true;
                            }
                        }
                )
            },200);
        });

        function edit_cancel() {
            var user_id = [[${user.kind}]];
            if(user_id.$name=="ADMIN") {
                self.location.href = '/admin/user/users';
            }else {
                self.location.href = '/admin/user/waiters';
            }
        };
    </script>
</section>
<section layout:fragment="content">
    <div class="main" style="margin: 5px">
        <form id="userForm" class="form" th:action="@{/admin/user/create}" th:method="post" >
            <table>
                <tbody>
                <tr>
                    <td style="text-align: right">
                        工号
                    </td>
                    <td>
                        <input placeholder="001" id="employee_no" name="employeeNo"  type="text">
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right">
                        姓名
                    </td>
                    <td>
                        <input placeholder="姓名" id="user_name" name="username"  type="text" >
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right">
                        手机
                    </td>
                    <td>
                        <input placeholder="手机号" id="mobile_id" name="mobile" type="text" autocomplete="off">
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right">
                        密码
                    </td>
                    <td>
                        <input placeholder="密码" onfocus="this.type='password'"  id="password_id" name="password" type="text" autocomplete="off">
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right">
                        角色
                    </td>
                    <td>
                        <select name="roleId" >
                            <option th:each="role : ${roles}"
                                    th:value="${role.id}"
                                    th:text="${role.name}">KindName</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" align="center" >
                        <input type="submit" class="new_button_yellow input_submit" value="添加">
                        <input type="button"  onclick="javascript:edit_cancel()"  class="new_button_yellow" value="取消">
                    </td>
                </tr>
                </tbody>
            </table>
        </form>
    </div>
</section>


</body>

</html>